<html lang="en-us">
<head>
    <meta charset="utf-8">
    <title>Chats</title>
    <meta name="csrf-token" content="{{ csrf_token }}">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Chats</title>
    <meta name="csrf-token" content="{{ csrf_token }}">
    <link href="static/bootstrap-5.2.3-dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body style = "background-color: rgb(51, 51, 51);">
    <script type="text/javascript" src="static/js/jquery.min.js"></script>    
    <script type="text/javascript" src="static/bootstrap-5.2.3-dist/js/bootstrap.bundle.min.js"></script>
    <script type="text/javascript" src="static/js/getSystems.js"></script>
    <h1 class = "h1" style = "background-color: rgb(255, 255, 255);text-align: center; ">Chats system market</h1>

<div class="container-fluid" style = "margin-left:7%;">
    <div id = "systems">
    </div>
</div>  
<div style ="text-align: center; margin-top : 1%">      
<form action="/" method="get">
    {% csrf_token %}
    <button name="back" value="back" class="btn btn-primary">回到对话</button>
<a id = "state"></a>
</div>
<script>
    loadSystems()
</script>
</form>
</body>
</html>